<template>
	<view>
		<view class="sear">
			<!-- <view style="position: relative; ">
				<image src="/static/index/search.png" style="width: 24rpx;height: 24rpx;position: absolute;top: 25rpx;left: 20rpx;" mode="aspectFit"></image>
				<input
					type="text"
					value=''
					@click="search"
					placeholder-style="font-size:24rpx;color:#9EA9B7;"
					placeholder="请输入社区名"
					style="padding-left: 64rpx; width: 630rpx;height: 72rpx;background-color: #Ffff;border-radius: 40rpx;"
				/>
			</view> -->
		</view>
		<view class="shequ">
			<text>当前社区</text>
			<view class="tuanzhang">
				<image :src="communityImg" mode="aspectFill"></image>
				<view style="font-size: 24rpx;color: #999;margin: 15rpx 0;">团长：{{ disUserName }}</view>
				<view style="font-size: 40rpx;color: #333;font-weight: bold;margin: 10rpx 0 30rpx;">{{ communityName }}</view>
				<view style="font-size: 24rpx;">{{ ziti_name }}</view>
			</view>
		</view>
		<view style="transform: translateY(-180rpx);">
			<view style="display: flex;align-items: center;margin: 40rpx 0 30rpx;">
				<view style="width: 8rpx;height: 40rpx;background-color: #00C657;"></view>
				<view style="font-size: 40rpx;color: #333;font-weight: bold;margin-left: 20rpx;">附近社区</view>
			</view>
			<view>
				<block v-for="(v, index) in communityList" :key="index">
					<view class="communityList" @click="changeCommunity(v)">
						<view>
							<image :src="v.headImg"></image>
						</view>					
						<view class="right">
							<view class="item">
								<text style="font-size: 28rpx;">{{v.communityName}}</text>
								<text style="color: #FF0000;font-size: 28rpx;" >距离{{v.distance}}</text>
							</view>
							<view class="item"> 
								<text style="color: #CCCCCC;font-size: 24rpx;">团长：{{v.disUserName}}</text>
								<uni-icons type="arrowright" size="16" color="#ddd"></uni-icons>
							</view>
							<view>
								<text style="font-size: 28rpx;">{{v.fullAddress}}</text>
							</view>
						</view>
					</view>
				</block>
			</view>
		</view>
	</view>
</template>

<script>
import { Storage } from '@/static/libs/utils.js';
export default {
	data() {
		return {
			ziti_name: '',
			communityName: '',
			disUserName: '',
			communityImg: '',
			communityList:[],
			head_id:''
		};
	},
	onLoad() {
		this.getTeamInfo();
		this.getCommunityList()
		this.SwitchHistoryCommunity()
	},
	methods: {
		search(){
			uni.navigateTo({
				url:'/pages/shequ/communityAddr/search/search'
			})
		},
		//当前团长信息
		getTeamInfo(e) {
			this.token = Storage.get('token');
			this.$request
				.post(
					`/wxapp.php?i=undefined&t=undefined&v=undefined&from=wxapp&c=entry&a=wxapp&do=user&&sign=4d72f82158e8312934d760ed5bf35993
			&token=${this.token}`,
					{
						controller: 'index.get_firstload_msg',
						m: 'lionfish_comshop'
					}
				)
				.then(res => {
					console.log('当前团长信息', res);
					this.communityImg = res.data.default_head_info.disUserHeadImg;
					this.ziti_name = res.data.default_head_info.fullAddress;
					this.communityName = res.data.default_head_info.communityName;
					this.disUserName = res.data.default_head_info.disUserName;
				});
				//this.SwitchHistoryCommunity(e)
		},
		//获取附近社区
		getCommunityList(){
			this.token = Storage.get('token')
			this.longitude = Storage.get('longitude')
			this.latitude = Storage.get('latitude')
			this.$request.post("/wxapp.php?from=wxapp&c=entry&a=wxapp&do=index&m=lionfish_comshop",
			{
				controller:'index.load_gps_community',
				token:this.token,
				pageNum:1,
				longitude:this.longitude,
				latitude:this.latitude,
				city_id:0
			}).then(res=> {
				console.log('社区列表',res)
				this.communityList = res.data.list
				var head_id = []
				for(let i in res.data.list){
					head_id[i] = res.data.list[i].communityId
					this.head_id = head_id[i]
					console.log('head_id',this.head_id)
				}
			})
		},
		changeCommunity(e){
			this.SwitchHistoryCommunity(e)
			uni.navigateTo({
				url:'../../shequ/shequ'
			})
		},
		SwitchHistoryCommunity(e){
			this.token = Storage.get('token')
			console.log('111111',e)
			this.$request.post("/wxapp.php?from=wxapp&c=entry&a=wxapp&do=index&m=lionfish_comshop",{
				controller: 'index.switch_history_community',
				token:this.token,
				head_id:e.communityId
			}).then(res=>{
				console.log('qiehuan',res)
			})
			this.getTeamInfo(e)
		}
	}
};
</script>

<style lang="scss">
.communityList {
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
	border-bottom: 2rpx solid #E5E5E5;
	padding: 50rpx 0;
	image {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
	    margin-left: 28rpx;
	}
	.right {
		margin-left: 20rpx;
		width: 540rpx;
		.item {
		   display: flex;
		   flex-direction: row;
		   justify-content: space-between;
		}
	}
}
.sear {
	padding-top: 20rpx;
	display: flex;
	justify-content: center;
	width: 100%;
	height: 300rpx;
	// background-image: linear-gradient(to bottom, #f75451, #f7866a);
	background-color: #00C657;
	border-radius: 0 0 80rpx 80rpx;
}
.shequ text {
	display: flex;
	justify-content: center;
	color: #fff;
	font-size: 28rpx;
}
.shequ {
	//margin-top: -180rpx;
	transform: translateY(-250rpx);
}
.tuanzhang {
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	width: 670rpx;
	height: 320rpx;
	border-radius: 30rpx;
	box-shadow: 0 0 5rpx 2rpx #c0c0c0;
	background-color: #fff;
	margin: 60rpx auto 0;
}
.tuanzhang image {
	width: 90rpx;
	height: 90rpx;
	border-radius: 50%;
	margin-top: -140rpx;
}
</style>
